import {LayoutOptions, MetaOptions} from './types/config';

/**
 * 元数据配置
 * @param title 大标题
 * @param endpoint 全局请求地址
 */
export const meta: MetaOptions = {
  title: '一个数据大屏', //大屏标题
  datetime: { // 时间组件配置
    format: 'yyyy/MM/dd HH:mm:ss',
    progress: { // 时间进度条耗时
      timeout: 60 // 单位秒
    }
  },
  theme: {
    rows: ['1fr', '1fr',], // 图表行数
    gap: 4 // 每个槽位之间的间隙
  },
  translate: {}, // 字段翻译
  color: [] // Echarts 的颜色管理
};

/**
 * 二维矩阵布局设置，使用 24 栏栅格系统
 * 使用 [] 表示行，使用 {} 表示列
 * @param span 栅格栏 w = 24 表示 24 栏
 */
export const layout: LayoutOptions[][] = [
  [
    {
      span: 6, // 栅格数
      slot: 'A0' // 槽位
    },
    {
      span: 12,
      slot: 'A1'
    },
    {
      span: 6,
      slot: 'A2'
    },
  ],
  [
    {
      span: 16,
      slot: 'C0'
    },
    {
      span: 8,
      slot: 'C1'
    },
  ]
];


/**
 * 各类型
 * @param slot 对应 Layout 配置的 slot 槽位
 */
export const charts = [
  {
    slot: 'A0', // 对应 Layout 的槽位
    endpoint: '',  // 接口地址
    type: 'Count', // 图表类型
    title: '统计数据', // 槽位标题
    keymap: { // 字段映射
      N0: 'resPoolCount',
      N1: 'hostResCount',
      N2: 'spuInstCount',
      N3: 'hostResCount',
      N4: 'tenantCount',
      N5: 'userCount',
    },
    name: {
      N0: '资源池数',
      N1: '主机数',
      N2: '实例数',
      N3: '节点数',
      N4: '租户数',
      N5: '用户数',
    },
    icon: {
      N0: 'hdd-stack-fill',
      N1: 'display-fill',
      N2: 'cpu-fill',
      N3: 'diagram-3-fill',
      N4: 'people-fill',
      N5: 'person-fill',
    }
  },
  {
    slot: 'A1',
    endpoint: '', // 接口地址
    query: { // 接口查询参数
      pastdays: 10
    },
    type: 'Chart',
    mode: 'map',
    title: '全国分布图',
    chartOption: { // Echarts 设置对象
      type: 'map',
      grid: {
        y: '5%',
        y2: '5%'
      },
      visualMap: {
        left: '2%',
        bottom: '0%',
        inRange: {
          color: ['#ABD9E9', '#313695',]
        },
        textStyle: {
          color: '#96A4CF'
        },
        text: ['High', 'Low'],           // 文本，默认为数值文本
        calculable: true,
        max: 100,
        min: 0
      },
      series: [
        {
          type: 'map',
          map: 'china',
          geo: {
            map: 'china',
            zoom: 1, //地图缩放级别
            top: 0,
            bottom: 0,
            layoutCenter: ['50%', '30%'],
            label: {
              show: false,
              fontSize: 10,
            },
          },
        }
      ]
    },
  },
  {
    slot: 'A2',
    endpoint: '',
    type: 'Chart',
    mode: 'bar',
    title: '租户实例开通数量排行',
    chartOption: {
      grid: {
        top: '10%',
        bottom: '5%',
        containLabel: true
      },
      label: {
        textBorderColor: false,
        color: '#96A4CF',
        overflow: 'break',
      }
    },
    query: {
      pastdays: 10
    }
  },
  {
    slot: 'C0',
    type: 'Chart',
    mode: 'line',
    title: '各省实例开通数量统计',
    endpoint: '',
  },
  {
    slot: 'C1',
    endpoint: '',
    mode: 'radar',
    title: '组件实例分布',
    type: 'Chart',
  }
];

export default {
  ...meta,
  layout,
  charts
};
